<h3>
    Movies: adding,editing,removing
</h3>

<div class="row my-row-standard">
    <div class="col-xs-3">
        <a href="#/movies/add" class="btn btn-block btn-lg btn-primary">Add new movie</a>
    </div>
    <div class="col-xs-9">
        <div class="form-group">
            <input type="text" value="" placeholder="Type movie name to search" class="form-control my-form-control"
                   ng-model="searchQuery">
        </div>
    </div>
</div>


<div class="row my-row-standard"
     ng-repeat="row in moviePageCtrl.movies | filter:moviePageCtrl.filterSearchQuery | partition:moviePageCtrl.getRowMoviesNum() ">
    <div class="col-xs-3" ng-repeat="movie in row">
        <div class="tile tile-movie">
            <img src="{{movie.image.thumbUrl}}" alt="{{movie.name}}" class="tile-image big-illustration">

            <h3 class="tile-title">{{movie.name | characters:21:true}}</h3>
            <!-- <p>100% convertable to HTML/CSS layout.</p> -->
            <a class="btn btn-info btn-large btn-block" href="#/movies/edit/{{movie.id}}">Изменить</a>
            <button class="btn btn-danger btn-large btn-block"
                    ng-click="moviePageCtrl.removeMovie(moviePageCtrl.calculateIndex($index,$parent.$index))">
                Удалить
            </button>
        </div>
    </div>
</div>


<my-goup-btn></my-goup-btn>